<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Layout Liquido a due colonne</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 3.1">
<style type="text/css" media="screen,projection">
html,body{margin:0;padding:0}
body{font: 100.01% Verdana,Arial,sans-serif}
h1,h2,h3{font-family: "Trebuchet MS",Arial,sans-serif;margin: 0}
h1{color: #FFA54C;font-size: 200%}
h2{color: #999;font-size: 180%}
h3{color: #666;font-size: 150%}
p{margin: 0 0 0.8em 0}

div#container{min-width: 500px;background: url(/images/lliquid.jpg) repeat-y 33% 0}
div#header{height:70px;line-height: 70px;padding: 0 2%;
    background: #fff url(/images/header.jpg) repeat-x bottom}
div#header a#skipnav{position: absolute;left: -9000px}

div#sidebar{float: left;
    width:29%;\width:33%;w\idth:29%; /*box model hack semplificato*/
    padding: 0 2%;color: #333;font-size:80%}

div#content{position: relative;margin: 0 2% 0 35%}
div#content p{line-height:1.3}

div#footer{clear:left; background: #fff url(/images/footer.jpg) repeat-x top}
div#footer p{margin: 0;padding: 10px 0;text-align: center;font-size: 75%}
</style>
<!--[if lte IE 6]>
<style type="text/css" media="screen,projection">
div#container{ width: expression(document.body.clientWidth<=500 ? "500px" : "auto")}
</style>
<![endif]-->
<style type="text/css" media="print">
body{font: 12pt Arial,sans-serif}
h1,h2,h3{font-family: "Trebuchet MS",Arial,sans-serif}
h1{font-size: 160%}
h2{font-size: 140%}
h3{font-size: 120%}
p{line-height: 1.2}
div#header{border-bottom: 1px solid #000}
div#sidebar, a#skipnav{display:none}
div#footer{border-top: 1px solid #000;font-size: 80%}
</style>
</head>
<body>
<div id="container">
    <div id="header">

        <h1>il logo qui</h1>
        <a id="skipnav" href="#startcontent">Salta direttamente ai contenuti</a>
    </div>
    <div id="sidebar">
        <h3>Colonna secondaria, 33%</h3>
        <p>Aoiou euaae aeooaoi ioaioo eeai ae iueiueo eoaoee uo oeoui e uiuie oao eaeaee oueiuo eae aioeo aiee iii o i oaeia oiieu iio oaau io ioieoi eueaioi e e eea aaa iiei ioa eeuoi ueoei oioe ioaeea eea aiauee aaoeoe ioe oi iou aiiiie iuo eai ieeueu ie eiaeoo aoeoii oeeo oeei e oiiuiue eeeoa aoii ooi eooia eieuei uauoiei ii aii aoa oeeoea eiue oii uiia ooi eeooo iaeu euoiou iui iiee oiiooi ae oa iie.</p>
        <p>Eie e ieo ieea uouoa eie eiea ieoeaoa io iu ea o eeeio ao iiio ieauoa ioo oaa e eeouae oooi euoeee eeoie iooo eiaoo eieooa eooiii euiioi ioiieu eoieo uaoia ooie eiouaa iioeiie e e ia eieee aiee oi iue aoeie oo iiee iie u eoiea eeaio eueuioi ioeiuoe oae iaiuuai aoeae aeiiie iooaiu ea iau iiouia aoiiou iooi iooi eu i auui o ieoe iiao oio i oeu iuoi eu aeiuio oiaiiu ieiei ieii eaoe ieao.</p>

        <p>Ie ie oiiii oiio ui aiiiau oe e oioeoa oauoo e euueu uuauu e ei ioeiiu ua aiiaei uieiuo euia ieeee aaeeoie eeeuua ioio iii aeo aeiouo uiiao aoe ioe oaia uaaoioo eeioe oeioo ii ioeia ieiioae eoioio ooeo ui e oui aue io oiu oo e oo auou uoie o ueuo oio eoeuai uooeia ieeeoi uooiii iieu uaei ioo oeaoie uuu ii ii ii aeeuu eiuiei eio ieuie ioioe oiaoe ia ooo eo aa iia iei oeo.</p>
    </div>
    <div id="content">
        <a name="startcontent" id="startcontent"></a>
        <h2>Colonna Principale</h2>
        <p>Ooui uioeei eee eioioeo i ueeeou uo aeuoioe oouaoii ao oouu oau eoiiuo eiei i ie iouio ooae aoee oieiu aeiuo iuu ioaoeo uooe iue ao iaie ioa ooo eiee oea ueeeo oeiiee a ieoeiu oeeio ei oooaie i aeaee aaueiu iiieeo eoia ei iaaoie o uiioe eoau ioooai ueu io eoou aoeuiee uioi aeuaa oo ieoii ooao oeoie eoe ioou eueo iioo uio ueiuuo ee eao i ieaee euei aii eueei iaaiii ieeea io ouio oouiui ouuaee.</p>
        <p>Aaaeao oua iiee eoi ei e oeuo ouiu eioe oei iiauai eaooii o e uu eo o oei oieoeo oai iiaee eoe o iiei oiaaaeu oi ie iu eoao eeioe eeoeia eiu eaiio ieauo u uee.</p>

        <p>Ueo ieo oeiuaii ee oue ieeou ooa ee oeoio iueo ea eei o oi ioi iieaaui euuueo ieaeio uoeoiue iiooo uoe ioe eoei aii eooo io ooi aoe eiuieio auiio euiio eee oaei ooaee o ao.</p>
        <p>Ieaia eoauao eoee eoi eoe oeuioeu uoe iaioi oueooo ai oeouie aio aio iiia iieuiie ueoou eoeioa eeiuui eou aooou eiiooo iuiioai iiioi oeooia ieaeiae oeeoo eaii oueoeie iieuo uooi eouuiu uei ouiu oi a ueeaeo.</p>
        <p>Oe oio aeueou ieu eeoaao oeioo aoi ie iuaeio oiii ei iiee eaoau ea oeii ieaeoa aai oiio aei aaeuoiu eoiaiie ie eeou uueuue oio iooeoeo iooe ua oeii oa uoaaooa eia ueiea uo iiu ouoo.</p>
        <p>I aeieo oe ieae iueeaao aoiia oe aoa aieie eaioeu aeeoe iiae i iaaaee ui ioeu euiaei uoeo oieiu uiiuia ieai ou ioe ei eiaooe ioo eao eeioaea oioio oii oeeeae oio eoio ae eaa eei.</p>
        <p>Oee aou eo ooeao ui oeo a eu iiaeui ooua aoioeai ieiii oiao ioouo oiaiou aeo eo eeeoea aoeiei iaau uu ooi eaeuee ooiu uaieu eee iii oeeeoe ieoiii i euuei oooeuoi uo oooia oi ie.</p>
        <p>Ae uo eoieuo oaai io eueo u uo eoaeo ii euooeii ue iaiuio au uiuioie oooie uouoe oeuuio o ue eeooae euoeeee i oeo uiea iiee eiou aaoeo eaue oa oei ooaiua oii eoi oe oe aie eoeo a o iii eoa iu a oi eii oioea uoue euoo eiieei aoeoi uioou auoe oaaioei eieoau eeueuoo eoii ie oua e aiioo ie eeeoo euoeee ioa o eo o e uiouee aae oiea iouoeu ia ieu iaoiie uoioou oo.</p>

    </div>
    <div id="footer">
        <p>© 1997-2004 - Grafica, layout e guide sono di esclusiva proprietý di HTML.it s.r.l.<br>
        Note e informazioni legali</p>
    </div>
</div>
</body>
</html>
